<template>
	<view class="bgf8">
		<!-- 地址 -->
		<view class="w343" style="height: 180rpx;;color: #000000;line-height: 38rpx;">
			<view class="fs15" style="padding:44rpx 0 0 30rpx;font-weight: 700;">
				<text>李大钊</text>
				<text style="margin-left: 20rpx;">18366711365</text>
			</view>
			<view class="fs13" style="margin-left: 30rpx;margin-top: 16rpx;">
				四川省成都市锦江区玉林路某小区A区15栋
			</view>
		</view>
		<!-- 成团 -->
		<view class="w343" style="height: 80rpx;line-height: 80rpx;margin-top: 20rpx;display: flex;font-weight: 700;position: relative;">
			<text class="fs14" style="margin-left: 30rpx;">成团人数</text>
			<view class="" style="margin-left: 34rpx;color: rgba(255,71,71,1);">5人团</view>
			<view class="" style="color: rgba(255,71,71,1);position: absolute;right: 8%;">拼团中</view>
		</view>
		<!-- 小计 -->
		<view class="w343" style="margin-top: 24rpx;">
			<view class="w90 fs14" style="height: 90rpx;line-height: 90rpx;">
				<h5>农夫果园(万达店)</h5>
			</view>
			<view class="w90" style="border-bottom: 1rpx solid rgba(243,243,243,1);">
				<view style="display: flex; margin: 30rpx 0" v-for="item in 2">
					<image src="../../../static/22.png"></image>
					<view style="margin-left: 30rpx;width: 70%;position: relative;">
						<view class="fs13" style="position: relative;">
							<text>赣南脐橙</text>
							<text style="position: absolute;right: 0;">￥8.8</text>
						</view>
						<text class="Ptc fs11">规格: 2斤</text><br>
						<text class="Ptc fs12">×2</text>
					</view>
				</view>
			</view>
			<view class="w90 fs12">
				<view style="padding: 30rpx 0;">
					<view style="position: relative;line-height: 46rpx;">
						<text>配送费</text>
						<text class="redrt">￥0</text>
					</view>
					<view style="position: relative;line-height: 46rpx;">
						<text>包装费</text>
						<text class="redrt">￥5</text>
					</view>
					<view style="position: relative;line-height: 46rpx;">
						<text>店铺满减</text>
						<text class="redrt">-￥5</text>
					</view>
				</view>
				<view style="position: relative;">
					<text>订单备注</text>
					<view class="redrt" style="top: 0;text-align: right;right: 10%;">
						<input class="fs12" type="text" value="" placeholder="在这里输入信息" />
						<image class="redrt" style="width: 10rpx;height: 18rpx;right: -5%;top: 8rpx;"
							src="../../../static/iconfh.png" mode=""></image>
					</view>
				</view>
				<view style="height: 80rpx;margin-top: 38rpx;position: relative;">
					<view class="fs12" style="position: absolute;right: 8%;">
						<text>小计</text><text>￥</text>
						<text class="fs16" style="font-weight: 700;">58.8</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 支付 -->
		<view class="pofx" style="">
			<view class="pobtm">
				<view class="poleft fs14" style="text-align: center;line-height: 90rpx;">
					共<text class="fs16" style="padding: 0 5rpx;">8</text> 件商品，合计：￥<text class="fs16" style="font-size: 700;">55</text>
				</view>
				<view class="poright center fs15">
					<navigator url="../../pintuan/zhifuCG/zhifuCG">立即支付</navigator>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style>
	.w343 {
		width: 686rpx;
		margin: 0 auto;
		background: #FFFFFF;
	}

	.w90 {
		width: 90%;
		margin: 0 auto;
		border-bottom: 1px solid #ececec;
	}

	.w90>view>image {
		width: 108rpx;
		height: 108rpx;
	}

	.redrt {
		
		color: rgba(255, 67, 67, 1);
		position: absolute;
		right: 8%;
	}

	.pofx {
		width: 100%;
		height: 150rpx;
		background: #FFFFFF;
		position: fixed;
		left: 0;
		bottom: 0rpx;

	}

	.pobtm {
		width: 686rpx;
		height: 90rpx;
		border-radius: 90rpx;
		line-height: 90rpx;
		position: absolute;
		top: 20rpx;
		left: 50%;
		transform: translateX(-50%);
		display: flex;
		overflow: hidden;
	}

	.poleft {
		width: 492rpx;
		height: 90rpx;
		background: rgba(36, 188, 129, 1);
		position: relative;
		line-height: 30rpx;
		color: #FFFFFF;
	}

	.poright {
		width: 194rpx;
		height: 90rpx;
		background: #FFCB57;
		font-weight: 700;
		color: #333333;
	}

	.text33 {
		position: absolute;
		left: 130rpx;
		top: 10rpx;
	}
</style>
